<template>
  <div>
    <!-- v-for:用于循环渲染结构 -->
    <!-- v-for 写在哪里,就表示渲染哪个标签 -->
    <!-- 语法:
         v-for="循环变量 in 数据"
     -->
    <ul>
      <li v-for="(item, index) in arr" :key="index">{{ item }}</li>
    </ul>
    <button @click="add" >加一个</button>
      <ul>
      <li v-for="num in 10" :key="num">{{ num }}</li>
    </ul>
  </div>
</template>

<script>
export default {

  data() {
    return {
      arr:['韩金龙','卢本伟','刘某']
    };
  },
  methods: {
    add(){
      this.arr.splice(1,0,'侯国玉')
    }
  }
};
</script>

<style lang="scss" scoped>

</style>